<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8"/>
    <title>折线图</title>
    <style>
        * {
            margin: 0;
            padding: 0;
        }

        html,
        body {
            width: 100%;
            height: 100%;
        }

        .chart {
            width: 100%;
            height: 100%;
        }

    </style>
    <!--    <script src="./echarts.min.js"></script>-->

    <!-- 方式二 -->
    <script src=" https://cdn.staticfile.org/echarts/5.5.0/echarts.min.js"></script>
    <!-- 或者 方式三  -->
    <!-- <script src="https://cdnjs.cloudflare.com/ajax/libs/echarts/5.5.0/echarts.min.js"></script> -->
</head>

<body>
<div id="chart" class="chart"></div>

<script type="text/javascript">
    const fontSizeNum = 36;
    const chartBox = document.getElementById("chart");
    var Chart = echarts.init(chartBox);
    var option = {
        tooltip: {
        trigger: 'axis'},
xAxis: {
type: 'category',
boundaryGap: false,
data: ['2024-04-01', '2024-04-02', '2024-04-03', '2024-04-04', '2024-04-05']
},
yAxis: {
type: 'value'
},
series: [
{
  type: 'line',
  stack: 'Total',
  data: [120, 132, 101, 134, 90],
  color: '#10B7E3'
},
{
  type: 'line',
  stack: 'Total',
  data: [220, 182, 191, 234, 290],
    color: '#FD9C66'
}
]
};

  function setOriginChartData(originChartData) {
        option=JSON.parse(originChartData)
         Chart.setOption(option);
  }

<!--        window.onload = function () {-->

<!--            Chart.setOption(option);-->
<!--        };-->

</script>
</body>

</html>